import React, { useReducer } from 'react'
// useReducer  处理复杂的数据

const reducer = (state, { type }) => {
    switch(type) {
        case "ADD_COUNT":
            state.count += 1
            return { ...state }
        default:
            return state
    }
}

const initState = {
    count: 999,
    num: 123,
    list: [5, 6, 7]
}

export default function HookReducer() {
    // useReducer(reducer, initState)
    const [state, dispatch] = useReducer(reducer, initState)
    const { count, num, list } = state
    return (
        <div>
            <p>
                Count: { count }  <button onClick={() => {
                    dispatch({ type: "ADD_COUNT" })
                }}> + 1</button>
            </p>
            <p>
                Num: { num }
            </p>
            <p>
                List: { list }
            </p>
        </div>
    )
}
